<!DOCTYPE html>
<html>

<head>
    <title>职工登录·车队管理系统</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- import CSS -->
    <link rel="stylesheet" href="/static/css/element.css">
    <link rel="stylesheet" href="/static/css/StartAdmin.css">
    <style>
        .login {
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: center;
            position: fixed;
            left: 5%;

            top: 0;
            bottom: 0;
        }

        .login-box {
            width: 400px;
        }
        /* 页脚 */
        footer {
            position: fixed;
            background-color: rgba(43, 166, 166, 0.5);
            color: #ffffff;
            bottom: 0;
            left: 0;
            right: 0;
            text-align: center;
            height: 20px;
            line-height: 20px;
        }
    </style>
</head>

<body>
<div id="app" v-cloak>
    <div id="Layer1" style="position:absolute; left:0px; top:0px; width:100%; height:100%">
        <img src="/static/images/bg4.png" width="100%" />
    </div>
    <div class="login">


            <div class="text item">
                <div align="center">
                    <img src="/static/images/logo.png" width="100px" height="100px" />
                </div>
                <el-form ref="form" :model="form">
                    <el-form-item>
                        <el-input v-model="form.username" placeholder="请输入你的帐号"
                                  prefix-icon="el-icon-mobile-phone" clearable>
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-input v-model="form.password" placeholder="请输入你的密码" prefix-icon="el-icon-lock"
                                  show-password></el-input>
                    </el-form-item>
                    <div style="text-align: center;">
                        <el-button type="primary" @click="onSubmit">登录帐号</el-button>
                    </div>
                </el-form>
            </div>

    </div>
</div>
<footer>Copyright (C) 车辆定位跟踪系统 技术支持:CQU_hhy 2020-2021, All Rights Reserved</footer>
</body>
<script src="/static/js/vue-2.6.10.min.js"></script>
<script src="/static/js/axios.min.js"></script>
<script src="/static/js/element.js"></script>
<script src="/static/js/StartAdmin.js"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                form: {
                    username: "",
                    password: ""
                }
            }
        },
        methods: {
            onSubmit() {
                var that = this;
                axios.post('worker/login', Object.assign({}, PostBase, that.form))
                    .then(function (response)
                    {
                        if (response.data.code == 200) {
                            that.$message({
                                message: '登录成功,正在跳转中',
                                type: 'success'
                            });
                            setTimeout(function () {
                                location.replace('');
                            }, 1000)
                        } else {
                            that.$message.error(response.data.msg);
                        }
                    })
                    .catch(function (error)
                    {
                        that.$message.error('登录失败，服务器内部错误');
                    })
                ;

            }
        }
    })
</script>

</html>